<!DOCTYPE html>
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<div id="outer">
    <div id="inner">
        <div id="innermost">
        </div>
    </div>
</div>
<script>
test(function(t)
{
    if (!window.internals)
        assert_unreached('This test requires window.internals.');

    outer.style.fontSize = "16px";
    innermost.style.fontSize = "1em";

    inner.offsetTop; // Force recalc.
    assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 0);

    assert_equals(getComputedStyle(outer).fontSize, "16px");
    assert_equals(getComputedStyle(inner).fontSize, "16px");
    assert_equals(getComputedStyle(innermost).fontSize, "16px");

    inner.offsetTop; // Force recalc.
    outer.style.fontSize = '10px';
    assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 3);

    assert_equals(getComputedStyle(outer).fontSize, "10px");
    assert_equals(getComputedStyle(inner).fontSize, "10px");
    assert_equals(getComputedStyle(innermost).fontSize, "10px");

    inner.offsetTop; // Force recalc.
    inner.style.fontSize = '16px';
    assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 2);

    assert_equals(getComputedStyle(outer).fontSize, "10px");
    assert_equals(getComputedStyle(inner).fontSize, "16px");
    assert_equals(getComputedStyle(innermost).fontSize, "16px");
}, "Changing font-size (a non-independent inherited property) in a way that results in an identical ComputedStyle still triggers a style recalc for its children.");

test(function(t)
{
    if (!window.internals)
        assert_unreached('This test requires window.internals.');

    outer.style.fontWeight = "normal";
    innermost.style.fontWeight = "lighter";

    inner.offsetTop; // Force recalc.
    assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 0);

    assert_equals(getComputedStyle(outer).fontWeight, "400");
    assert_equals(getComputedStyle(inner).fontWeight, "400");
    assert_equals(getComputedStyle(innermost).fontWeight, "100");

    inner.offsetTop; // Force recalc.
    inner.style.fontWeight = 'bolder';
    assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 2);

    assert_equals(getComputedStyle(outer).fontWeight, "400");
    assert_equals(getComputedStyle(inner).fontWeight, "700");
    assert_equals(getComputedStyle(innermost).fontWeight, "400");

    inner.offsetTop; // Force recalc.
    outer.style.fontWeight = 'bold';
    assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 3);

    assert_equals(getComputedStyle(outer).fontWeight, "700");
    assert_equals(getComputedStyle(inner).fontWeight, "900");
    assert_equals(getComputedStyle(innermost).fontWeight, "700");
}, "Changing font-weight (a non-independent inherited property) in a way that results in an identical ComputedStyle still triggers a style recalc for its children.");
</script>
